<!--商品管理-商品价格 页面-->
<template>
    <div class="price-edit-root">
        <!--对话框-->
        <el-dialog
                title="修改商品价格"
                :visible.sync="dialogVisible"
                :close="close"
                :before-close="close"
                width="60%"
                center>

            <el-form ref="goodsPriceParam" :model="goodsPriceParam" label-width="80px">
                <el-form-item label="商品编码">
                    <span class="goods-code-font">{{ goods.goodsCode }}</span>
                </el-form-item>
                <el-form-item label="商品名称">
                    <span class="goods-name-font"> {{ goods.goodsName }} </span>
                </el-form-item>
                <el-form-item label="商品价格">
                    <div v-if="goodsPriceParam.goodsPriceList && goodsPriceParam.goodsPriceList.length > 0">
                        <div v-for="(item, i) in goodsPriceParam.goodsPriceList" :key="i">
                            <el-input-number v-model="item.price" :min="0" size="small"></el-input-number> 元 / <el-tag type="warning">{{ item.unit }}</el-tag>
                            <span style="margin-left: 20px"> 活动价格：</span>
                            <el-input-number v-model="item.lowPrice" :min="0" size="small" style="margin-left: 5px"/>元
                        </div>
                    </div>
                    <div v-else>
                        暂无价格
                    </div>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button type="primary" @click="submitChange">提交修改</el-button>
                <el-button @click="close">取 消</el-button>
            </span>
        </el-dialog> <!--/ 对话框-->

    </div>
</template>

<script>
import API from '@/api/api.js'

export default {
    name: "PriceEdit",
    props:['goods'],
    components: {
    },
    data() {
        return {
            //
            dialogVisible: true,
            //
            selectGoodUnitFlag: false,
            // 价格详情
            goodsPriceDetail: {

            },
            // 商品价格(用于发请求)
            goodsPriceParam: {
                goodsCode: '',
                flag: null,
                goodsPriceList: [],
            },
            // 商品单位
            unitList: [],
        }
    },
    mounted() {
        console.log(this.goods, '~~~~~~~~~~~~~~~~~goods');
        this.selectGoodUnit();
        this.getPrice();

    },
    methods: {
        // 关闭‘修改价格’对话框
        close() {
            this.$emit("close");
        },
        // 查询商品单位
        selectGoodUnit() {
            let url = API.unit.selectUnitList;
            this.$get(url, {}).then( res => {
                let data = res.data;
                if (data.success) {
                    this.unitList = data.data.list;
                }
            }).catch( err => {
                this.$message.error("请求失败!");
            })
        },
        // 查询商品价格
        getPrice() {
            if (this.goods) {
                let url = API.goodsPrice.selectUnitPrice;
                let param = this.goods;
                this.$get(url, param).then(res => {
                    let data = res.data;
                    if (data.success) {
                        console.log(data.data, "~~~~~~~~~data.data");
                        this.goodsPriceDetail.goodsPriceList = data.data;
                        let temp = JSON.parse(JSON.stringify(this.goodsPriceDetail));
                        // 商品价格
                        Object.keys(temp).forEach( key => {this.goodsPriceParam[key] = temp[key]} );
                    }
                }).catch( err => {
                    this.$message.error("请求失败!")
                })
            }
        },
        // 提交修改
        submitChange() {
            let url = API.goods.update;
            this.goodsPriceParam.goodsCode = this.goods.goodsCode;
            let param = JSON.parse(JSON.stringify(this.goodsPriceParam));
            param.goodsPriceList.filter(item => item.price <= 0).forEach(item => param.goodsPriceList.splice(param.goodsPriceList.indexOf(item), 1));
            param.originGoodsCode = param.goodsCode;
            param.id = this.goods.id;
            console.log(param,"提交修改----------------");


            this.$post(url, param).then( res => {
                let data = res.data;
                console.log("修改价格响应~~~~~~~~~~~~~~~~~~~~~~~`");
                if (data.success) {
                    // this.close();
                    this.$message({
                        type: 'success',
                        message: data.msg,
                        showClose: true,
                    })
                } else {
                    this.$message.error(data.msg);
                }
            }).catch( err => {
                this.$message.error("请求失败!");
            })
        }
    }
}
</script>

<style lang="scss" scoped>
    .price-edit-root {
        align-items: center;

        .goods-code-font{
            color: #1a8bd5;
        }
        /deep/.el-input__inner{
            padding: 0 8px;
        }
    }
</style>
